import React, { useState, useEffect } from 'react';
import {
    NavBar,
    Icon,
    List,
    Button,
    Toast,
    Accordion,
    Modal, TextareaItem
} from 'antd-mobile';

import { withRouter } from 'react-router-dom'
import { ViewResume, ChooseApply, CancelChooseApply } from "@/api/order/order.js"
import './orderDetails.scss';

import { R, ORDER_STATUSES } from "@/assets/js/dict"
import { previewPict } from "@/api/login";

import { PhotoProvider, PhotoConsumer } from 'react-photo-view';

function OrderDetailsOfSelect (props) {
    let [biographicalNotesDetailsObject, SetBiographicalNotesDetailsObject] = useState({});

    const [applyInfo] = useState(() => {
        let source = sessionStorage.getItem("applyInfo");
        if (!!source) {
            let info = JSON.parse(source);
            console.log("init.info---->", info);
            return info;
        }
    });

    const userInfo = JSON.parse(sessionStorage.getItem('userInfo'));

    // 家长选择家教
    let handleSelect = () => {
        let postDate = {
            order_id: applyInfo.order_id,
            parent_id: userInfo.id,
            apply_id: applyInfo.id,
            tutor_id: applyInfo.tutor_id,
        }

        ChooseApply(postDate, (res) => {
            if (res.code == "000000") {
                sessionStorage.removeItem("applyInfo");
                props.history.goBack()
            }
        });
    }

    let handleCancelSelect = () => {
        let postDate = {
            order_id: applyInfo.order_id,
            parent_id: userInfo.id,
            apply_id: applyInfo.id,
            tutor_id: applyInfo.tutor_id,
        }

        CancelChooseApply(postDate, (res) => {
            if (res.code == "000000") {
                sessionStorage.removeItem("applyInfo");
                props.history.goBack()
            }
        });
    }

    // 选择课程类型  文 / 理
    let handleCourseType = () => {
        console.log('Resume.class_type  ---------->>>>', props.biographicalNotesDetailsObject)
        if (biographicalNotesDetailsObject.class_type == '文科') {
            return (
                <div>
                    <List.Item
                        extra={biographicalNotesDetailsObject.college_politics}
                    >高考-政治</List.Item>
                    <List.Item
                        extra={biographicalNotesDetailsObject.college_history}
                    >高考-历史</List.Item>
                    <List.Item
                        extra={biographicalNotesDetailsObject.college_geography}
                    >高考-地理</List.Item>
                </div>
            )
        } else if (biographicalNotesDetailsObject.class_type == '理科') {
            return (
                <div>
                    <List.Item
                        extra={biographicalNotesDetailsObject.college_physics}
                    >高考-物理</List.Item>
                    <List.Item
                        extra={biographicalNotesDetailsObject.college_chemie}
                    >高考-化学</List.Item>
                    <List.Item
                        extra={biographicalNotesDetailsObject.college_biology}
                    >中考-生物</List.Item>
                </div>
            )
        }
    }

    useEffect(() => {
        console.log('props --->>>', props);
        let params = {}
        let source = sessionStorage.getItem("applyInfo");
        if (!!source) {
            let info = JSON.parse(source);
            console.log("applyInfo-->", info);
            params.order_id = info.order_id;
            params.tutor_id = info.tutor_id;
        } else {
            Toast.offline("没有足够的参数", 2);
        }


        ViewResume(params, (res) => {
            if (res.code == "000000") {
                SetBiographicalNotesDetailsObject(res.responseData)
            }
        });
    }, []);

    return (
        <div className="orderDetails">
            <div className="page-title  home-tit">
                <NavBar
                    mode="light"
                    icon={<Icon type="left" />}
                    onLeftClick={() => {
                        sessionStorage.removeItem("applyInfo");
                        props.history.goBack()
                    }}
                >
                    家教简历
                </NavBar>
            </div>

            <div className="page-content  home-content">
                <div className="publish-content-piece">
                    <div className="form-box">
                        <div className="form-tit">
                            <i className="mini-block"></i>
                            <strong>基本信息</strong>
                        </div>
                        <div className="form-con">
                            <List>
                                <List.Item extra={biographicalNotesDetailsObject.name}
                                >姓名</List.Item>
                                <List.Item extra={biographicalNotesDetailsObject.gender}
                                >性别</List.Item>
                                <List.Item extra={biographicalNotesDetailsObject.school}
                                >学校</List.Item>
                                <List.Item extra={biographicalNotesDetailsObject.college}
                                >学院</List.Item>
                                <List.Item extra={biographicalNotesDetailsObject.code}
                                >学号</List.Item>
                                <List.Item extra={
                                    <div>
                                        {
                                            biographicalNotesDetailsObject.pict ?
                                                <PhotoProvider>
                                                    {
                                                        (biographicalNotesDetailsObject.pict).split(',').map((item, index) => {
                                                            if (item != "") {
                                                                return <PhotoConsumer key={index} src={previewPict(item)} intro={''}>
                                                                    <img
                                                                        key={item}
                                                                        style={{
                                                                            width: 'auto',
                                                                            height: 'auto',
                                                                            maxHeight: '70px',
                                                                            maxWidth: '100px',
                                                                            margin: '0 5px'
                                                                        }} src={previewPict(item)}
                                                                        alt={"学生证照片" + (index + 1)}
                                                                    />
                                                                </PhotoConsumer>
                                                            }
                                                        })
                                                    }
                                                </PhotoProvider>
                                                :
                                                ''
                                        }
                                    </div>

                                }>学生证照片</List.Item>
                                <List.Item extra={biographicalNotesDetailsObject.profession}
                                >专业</List.Item>
                            </List>
                        </div>

                        <div className="form-tit">
                            <i className="mini-block"></i>
                            <strong>教育信息</strong>
                        </div>
                        <div className="form-con">
                            <List>
                                <List.Item
                                    extra={biographicalNotesDetailsObject.grade}
                                >年级</List.Item>
                                <List.Item
                                    extra={biographicalNotesDetailsObject.high_school_province}
                                >中考省份</List.Item>
                                <List.Item
                                    extra={biographicalNotesDetailsObject.high_score_ranking}
                                >中考成绩排名</List.Item>
                                <Accordion accordion className="subject-list">
                                    <Accordion.Panel header="中考单科成绩" key="1">
                                        <List>
                                            <List.Item
                                                extra={biographicalNotesDetailsObject.high_language}
                                            >中考-语文</List.Item>
                                            <List.Item
                                                extra={biographicalNotesDetailsObject.high_math}
                                            >中考-数学</List.Item>
                                            <List.Item
                                                extra={biographicalNotesDetailsObject.high_english}
                                            >中考-英语</List.Item>
                                            <List.Item
                                                extra={biographicalNotesDetailsObject.high_physics}
                                            >中考-物理</List.Item>
                                            <List.Item
                                                extra={biographicalNotesDetailsObject.high_chemie}
                                            >中考-化学</List.Item>
                                            <List.Item
                                                extra={biographicalNotesDetailsObject.high_politics}
                                            >中考-政治</List.Item>
                                            <List.Item
                                                extra={biographicalNotesDetailsObject.high_history}
                                            >中考-历史</List.Item>
                                            <List.Item
                                                extra={biographicalNotesDetailsObject.high_geography}
                                            >中考-地理</List.Item>
                                            <List.Item
                                                extra={biographicalNotesDetailsObject.high_biology}
                                            >中考-生物</List.Item>
                                        </List>
                                    </Accordion.Panel>
                                </Accordion>
                                <List.Item
                                    extra={biographicalNotesDetailsObject.college_school_province}
                                >高考省份</List.Item>
                                <List.Item
                                    extra={biographicalNotesDetailsObject.college_score_ranking}
                                >高考成绩排名</List.Item>
                                <Accordion accordion className="subject-list">
                                    <Accordion.Panel
                                        header={`高考单科成绩（${biographicalNotesDetailsObject.class_type ? biographicalNotesDetailsObject.class_type : ''}）`}
                                        key="2">
                                        <List>
                                            <List.Item
                                                extra={biographicalNotesDetailsObject.college_language}
                                            >高考-语文</List.Item>
                                            <List.Item
                                                extra={biographicalNotesDetailsObject.college_math}
                                            >高考-数学</List.Item>
                                            <List.Item
                                                extra={biographicalNotesDetailsObject.college_english}
                                            >高考-英语</List.Item>
                                            {handleCourseType()}
                                        </List>
                                    </Accordion.Panel>
                                </Accordion>
                                <List.Item
                                    extra={biographicalNotesDetailsObject.skilled_subjects}
                                >擅长的科目</List.Item>
                            </List>
                            <Accordion accordion className="my-accordion">
                                <Accordion.Panel header="擅长辅导的年级" key="1">
                                    <div className="textarea-box">
                                        <List.Item
                                            extra={biographicalNotesDetailsObject.skilled_grades}
                                            wrap
                                        ></List.Item>
                                    </div>
                                </Accordion.Panel>
                                <Accordion.Panel header="家教经验" key="2">
                                    <div className="textarea-box">
                                        <TextareaItem
                                            title={'家教经验一'}
                                            placeholder="无"
                                            rows="6"
                                            autoHeight
                                            editable={false}
                                            value={biographicalNotesDetailsObject.experience_one}
                                        />
                                    </div>

                                    <div className="textarea-box">
                                        <TextareaItem
                                            title={'家教经验二'}
                                            placeholder="无"
                                            rows="6"
                                            autoHeight
                                            editable={false}
                                            value={biographicalNotesDetailsObject.experience_tow}
                                        />
                                    </div>

                                    <div className="textarea-box">
                                        <TextareaItem
                                            title={'家教经验三'}
                                            placeholder="无"
                                            rows="6"
                                            autoHeight
                                            editable={false}
                                            value={biographicalNotesDetailsObject.experience_three}
                                        />
                                    </div>
                                </Accordion.Panel>
                                <Accordion.Panel header="获奖情况" key="3">
                                    <div className="textarea-box">
                                        <List.Item
                                            extra={biographicalNotesDetailsObject.prize}
                                            wrap
                                        ></List.Item>
                                    </div>
                                </Accordion.Panel>
                                <Accordion.Panel header="其他特长" key="4">
                                    <div className="textarea-box">
                                        <List.Item
                                            extra={biographicalNotesDetailsObject.qttc}
                                            wrap
                                        ></List.Item>
                                    </div>
                                </Accordion.Panel>
                            </Accordion>
                        </div>
                        <div className="form-tit">
                            <i className="mini-block"></i>
                            <strong>其他信息</strong>
                        </div>
                        <div className="form-con">
                            <Accordion accordion className="my-accordion">
                                <Accordion.Panel header="自我评价" key="1">
                                    <div className="textarea-box">
                                        <List.Item
                                            extra={biographicalNotesDetailsObject.self_evaluation}
                                            wrap
                                        ></List.Item>
                                    </div>
                                </Accordion.Panel>
                                <Accordion.Panel header="教学理念" key="2">
                                    <div className="textarea-box">
                                        <List.Item
                                            extra={biographicalNotesDetailsObject.teaching_idea}
                                            wrap
                                        ></List.Item>
                                    </div>
                                </Accordion.Panel>
                            </Accordion>
                        </div>


                        <div className="form-footer">
                            <Button type="primary"
                                style={{ display: (applyInfo.order_status === ORDER_STATUSES.PUBLISH || applyInfo.order_status === ORDER_STATUSES.FULL) ? 'block' : 'none' }}
                                onClick={() => {
                                    Modal.alert('提示', '确认选择此位家教吗?', [
                                        { text: '放弃', onPress: () => console.log('cancel') },
                                        { text: '确定', onPress: () => handleSelect() },
                                    ])
                                }}>选择家教</Button>

                            <Button type="warning"
                                style={{ display: applyInfo.order_status === ORDER_STATUSES.SELECTED ? 'block' : 'none' }}
                                onClick={() => {
                                    Modal.alert('提示', '确认取消选择此位家教吗?', [
                                        { text: '放弃', onPress: () => console.log('cancel') },
                                        { text: '确定', onPress: () => handleCancelSelect() },
                                    ])
                                }}>取消选择</Button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    );
}

export default withRouter(OrderDetailsOfSelect);